<template>
  <a-form-model ref="formComp" :model="formData" :rules="rules" layout="horizontal" class="AsteriskAfter newEditStyle">
    <a-row>
      <a-col :md="24" :sm="24">
        <a-form-model-item :label="$t('orgName')" prop="name">
          <a-input v-model="formData.name" />
        </a-form-model-item>
      </a-col>
    </a-row>
    <a-row>
      <a-col :md="24" :sm="24">
        <a-form-model-item :label="$t('remark')" prop="remark">
          <custom-text-area
            @change="formData.remark = $event"
            :val="formData.remark"
            :rows="5"
            :max-len="200"
          ></custom-text-area>
        </a-form-model-item>
      </a-col>
    </a-row>
  </a-form-model>
</template>
<script>
import lodash from 'lodash'
import { mapMutations } from 'vuex'
import { checkTextLen } from '@/utils/validate'
import CustomTextArea from '@/components/CustomTextArea/index.vue'
export default {
  components: {
    CustomTextArea
  },
  props: {
    editRecord: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data () {
    return {
      formData: {
        name: '',
        remark: '',
        parentId: null,
        id: null
      },
      rules: {
        name: [
          { required: true, message: this.$t('pleaseInput') },
          { validator: checkTextLen() }
        ],
        remark: [
          { pattern: this.$patternRemark, message: this.$patternRemarkM },
          { validator: checkTextLen(200) }
        ]
      }
    }
  },
  watch: {
    editRecord: {
      handler (val) {
        this.resetFormData()
        this.$nextTick(() => {
          Object.keys(this.formData).forEach(key => {
            if (typeof val[key] !== 'undefined') {
              this.formData[key] = val[key]
            }
          })
        })
      },
      immediate: true
    },
    formData: {
      handler (val) {
        this.SET_rightSubmitDisabled(lodash.isMatch(val, this.editRecord))
      },
      deep: true
    }
  },
  created () {
  },
  methods: {
    ...mapMutations(['SET_rightSubmitDisabled']),
    // 获取表单中的数据
    getFormData () {
      return new Promise((resolve, reject) => {
        const data = this.formData
        console.log(this.formData, '2424')
        this.$refs.formComp.validate(valid => {
          if (!valid) {
            reject(valid)
          }
          resolve(data)
        })
      })
    },
    resetFormData () {
      this.$refs.formComp && this.$refs.formComp.resetFields()
    }
  }
}
</script>
